.related-form-modal {
    .base-modal-body {
      padding: 20px 30px;
  
      display: flex;
      flex-flow: row nowrap;
  
      .relation-options-panel {
        min-height: 350px;
        flex: 1;
        border: 1px solid $color-border-l2;
        border-radius: $border-radius-base;
  
        h4 {
          padding: 12px;
          margin-bottom: 0;
  
          display: flex;
          justify-content: space-between;
          background: #F5F8FA;
          border-bottom: 1px solid $color-border-l2;
  
          span {
            font-weight: normal;
            color: $text-color-secondary;
          }
        }
  
        label {
          display: block;
          color: $text-color-regular;
          font-weight: 400px;
        }
  
        .el-checkbox-group {
          padding: 4px 12px 0 12px;
          height: calc(100% - 43px);
          overflow-y: auto;
          .el-checkbox {
            line-height: 30px;
          }
  
          .el-checkbox__label {
            overflow-wrap: break-word;
            text-overflow: ellipsis; 
            white-space: normal;
            word-break: break-all;
          }
        }
  
        .relation-options-selected-panel {
          padding: 0px;
          height: calc(100% - 43px);
          overflow-y: auto;
          label {
            line-height: 30px;
            padding-left: 12px;
            .relation-options-selected-cont {
              display: inline-block;
              width: 160px;
              color: #262626;
              ;
            }
            .icon-close-circle {
              cursor: pointer;
              visibility: hidden

            }
            &:hover {
              background: #F5F8FA;
              .icon-close-circle {
                visibility: inherit;
              }
            }
          }
        }
      }
  
      .relation-options-icon {
        margin: 0 12px;
  
        display: flex;
        align-items: center;
  
        i {
          color: $text-color-secondary;
        }
      }
    }
  }